<?php 
/* 
Proyecto: Sistema Victoria 2.0
Programador: Felipe Guerra
Año: 2015
Flores de tumbabiro ©
*/
require_once('../core/libreria.php');
require_once('../db/connect.php'); 

$programa_nom = 'pais';
$ms = $_GET['ms'];
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="../css/list.css" /><!--Importante, siempre debe ir antes del css del menu vertical-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>

<!-- title -->
<?php require_once('../core/title.php'); ?> 

<!-- BANNER -->
<?php require_once('../core/banner.php'); ?> 

<!-- Menú superior -->
<?php require_once('../core/menuSuperior.php'); ?> 

</head>

<body <?php require_once('../core/BodyBackground.php'); ?>  >
<br><br><br>
	
<form action="" method="get" name="forma" id="forma" > 
<table width="100%" border="0" >
  <tr>
    <td width="15%" valign="top" >
		<!-- Menú Vertical -->
		<?php require_once('../core/menuVertical.php'); ?> 
    </td>
    <td width="25%" valign="top" id="arbol_td" >
    
        <!--//┌────────────────────────────────┐INICIO - ARBOL-->
        
		<link rel="stylesheet" href="../arbol/dist/themes/default/style.min.css" />        
        
        <?php 
		$sql_arbol = "SELECT PAI_CODIGO AS CODIGO, PAI_PAI_CODIGO AS PA_CODIGO, PAI_NOMBRE AS NOMBRE FROM pais ORDER BY NOMBRE";		
        ?>

        <script src="../arbol/dist/jstree.min.js"></script>
        
        <script>
        $(document).ready(function(e) {
			
			//Funcionalidad que permite regresar al metodo tradicional de iframe
			$(".url").click(function(e) {
				var url = $(this).attr("id");
				var reference = $(this).attr("reference");			
				window.location = '../core/index.php?ms=<?php echo $_GET['ms']?>&url=' + url + '&reference=' + reference;
			});			
			
			arbolRecargar_2();
        });	
		
		function arbolRecargar_2(){

			$("#arbol").html('<div id="evts" class="demo"></div>');//Encera el div que contiene el arbol
			var arbolReturn = '';

			$.ajax({
				async:true, 
				type: 'POST',  
				dataType: "json", 
				url: "paisArbol.php",
				data: "sql_arbol=<?php echo $sql_arbol?>", 
				success:  function(respuesta){
					//alert(respuesta);
					//┌────────────────────────────────┐
					arbolReturn = respuesta;
					var altoPorcentaje = $( window ).height()/10*7;
					var pa;
					
					$("#arbol").width( $('#arbol_td').outerWidth() - 20 );//Hace que el div que contiene el arbol no lo sobrepase al td a lo ancho
		
					$("#arbol").height( altoPorcentaje - 4 );
					$("#myframe").height( altoPorcentaje + 23 );			
					td = altoPorcentaje - 112;
					$('#evts')
						.on("changed.jstree", function (e, data) {
							pa = data.instance.get_node(data.selected[0]).id;
							$('#myframe').attr('src','<?php echo $programa_nom;?>List.php?ms=<?php echo $ms?>&pa=' + pa + '&td=' + td );
						})
						.jstree({
						'core' : {
							'data' : arbolReturn
						}
					});		
					//└────────────────────────────────┘								  

				}
			});		

		
		}		
		
        </script>
        <div id="arbol" >
            <div id="evts" class="demo"></div>
        </div>       
        <!--//└────────────────────────────────┘FIN - ARBOL-->             
    </td>    
    <td width="60%" align="center" valign="top" >
		<iframe id="myframe" src="<?php echo $programa_nom;?>List.php?hide=true" width="90%" height="" marginheight="0" marginwidth="0" noresize scrolling="No" frameborder="0" ></iframe>    
    </td>
  </tr>
</table>
<form>

</body>
</html>